<template>
  <div class="auto-login">
    <div class="loading">自动登录中...</div>
  </div>
</template>

<script setup>
import { ref, reactive, getCurrentInstance, onMounted } from "vue";
import { useRouter, useRoute } from "vue-router";
import md5 from "js-md5";
const { proxy } = getCurrentInstance();
const router = useRouter();
const route = useRoute();

const api = {
  login: "/autoLogin",
};

onMounted(() => {
  autoLogin();
});

const autoLogin = async () => {
  // 自动登录的账号信息
  const email = "1071214757@qq.com";
  const password = "123123qwe";

  // 对密码进行md5加密
  const encryptedPassword = md5(password);

  // 构造登录参数
  const params = {
    email: email,
    password: encryptedPassword,
    rememberMe: true
  };

  try {
    // 发送登录请求
    let result = await proxy.Request({
      url: api.login,
      params: params
    });

    if (result) {
      // 登录成功，存储用户信息到cookie
      proxy.VueCookies.set("userInfo", result.data, 0);

      // 跳转到主页
      router.push("/");
    } else {
      // 登录失败，跳转到登录页
      router.push("/login");
    }
  } catch (error) {
    // 出现异常，跳转到登录页
    router.push("/login");
  }
};
</script>

<style lang="scss" scoped>
.auto-login {
  display: flex;
  justify-content: center;
  align-items: center;
  height: 100vh;
  background: #f5f5f5;

  .loading {
    font-size: 18px;
    color: #666;
  }
}
</style>